<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <style media="screen">
    .box {width:400px; height:400px; background:#CCC; margin:100px auto 0;}
    </style>
    <script src="hammer.js" charset="utf-8"></script>
    <script>
    window.onload=function (){
      let oBox=document.querySelector('.box');
      let deg=0,old_deg;

      let hammer=new Hammer(oBox);

      hammer.get('rotate').set({enable: true});
      hammer.on('rotatestart', ev=>{
        old_deg=deg;
      });
      hammer.on('rotatemove', ev=>{
        deg=old_deg+ev.rotation;

        oBox.style.transfrom=`rotate(${deg}deg)`;
      });
      hammer.on('rotateend', ev=>{});
    };
    </script>
  </head>
  <body>
    <div class="box"></div>
  </body>
</html>
